// Padding/margin helper, ie. p-0, pt-0, pr-0, pb-0, pl-0
// $primary: #ee403d;

$gutter: 10rpx;

@for $i from 0 through 5 {

  @each $short,
  $long in (p, padding),
  (m, margin) {
    .#{$short}-#{$i} {
      #{$long}: ($gutter * $i) !important;
    }

    @each $pos,
    $position in (t, top),
    (r, right),
    (b, bottom),
    (l, left) {
      .#{$short}#{$pos}-#{$i} {
        #{$long}-#{$position}: ($gutter * $i) !important;
      }
    }

    @each $pos,
    $y,
    $x in (y, bottom, top),
    (x, left, right) {
      .#{$short}#{$pos}-#{$i} {
        #{$long}-#{$y}: ($gutter * $i) !important;
        #{$long}-#{$x}: ($gutter * $i) !important;
      }
    }
  }
}

page {
  // font-family: 'PingFangSC-Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-family: 'PingFang SC', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  font-size: 28rpx;
}

::v-deep .uni-list-plus {
  .uni-list-item__container {
    padding-top: 18px !important;
    padding-bottom: 18px !important;

    .uni-list-item__content-title {
      font-size: 30rpx;
    }

    .uni-list-item__extra-text {
      font-size: 26rpx;
    }
  }

  .uni-list--border {
    width: calc(100% - 30rpx);
    margin-left: 15rpx;
  }
}

.btn-default {
  background-color: #fff;
}

.btn-primary,
.btn-outline-primary,
.btn-outline-gray {
  background-color: $primary;
  color: #fff;
  // border-radius: 64rpx;
  border-radius: 0;
  font-size: 26rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  line-height: 40px;
  text-align: center;
  width: 100%;
  font-weight: 600;

  &.inline {
    width: auto;
    padding: 0 30rpx;
  }

  &.button-hover,
  &:active {
    background-color: darken($primary, 10%);
    border-color: darken($primary, 10%);
    color: #fff;
  }

  &.disabled,
  &:disabled {
    opacity: 0.7;
  }

  &.plain {
    background-color: rgba($primary, 0.06);
    color: $primary;

    &::after {
      border-color: $primary;
    }
  }
}

.btn-outline-gray {
  background-color: transparent;
  color: #666;
  height: 38px;
  line-height: 38px;
  border: 1px solid #ddd;
}

.btn-outline-primary {
  background-color: transparent;
  color: $primary;
  height: 38px;
  line-height: 38px;
  border: 1px solid $primary;
}

.product-grid-wrap {
  padding: 0 20rpx;
  // margin-top: 20rpx;
  display: flex;
  flex-direction: row !important;
  flex-wrap: wrap;
  justify-content: space-between;

  .product-grid {
    // #ifndef APP-PLUS-NVUE
    width: calc(50% - 10rpx);
    // #endif
  }
}

.page-fixed-bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  box-sizing: border-box;
  width: 100%;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  padding: 0 30rpx;
  display: flex;
  align-items: center;
  height: calc(56px + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
}

::v-deep .uni-forms-item--border {
  .uni-forms-item__label {
    height: 78rpx !important;
  }
}

::v-deep .uni-easyinput__content {
  border-radius: 0 !important;

  &.is-focused {
    border-color: #000 !important;
  }

  .uni-easyinput__content-input {
    height: 80rpx !important;
    // font-size: 16px;
  }
}

.uni-easyinput {
  .uni-easyinput__content {
    &.is-focused {
      .uni-icons {
        color: #222 !important;
      }
    }
  }
}